<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			div {
				width: 100px;
				height: 100px;
				background-color: deeppink;
				/* cursor:hand; */
				cursor:pointer;
			}
			.aaa {
				width: 200px;
				height: 200px;
				background-color: aqua;
			}
		</style>
	</head>
	<body>
		<div id="box" onclick="fn()">
			
		</div>
		<script type="text/javascript">
			var div = document.getElementById("box");
			
// 			var arr1 = document.getElementsByClassName("leiming");
// 			var arr2 = document.getElementsByTagName("div");
			
			// var arr3 = document.getElementsByName();
			
			
			div.onclick = function () {
				// alert(1);
				//可以操作表情标签属性和样式
				// div.class = "aaa";
				div.style.width = "200px";
				div.style.height = "200px";
				div.style.backgroundColor = "red";
			}

// 			div.onclick = fn;
// 			function fn() {
// 				alert(1);
// 			}
			
// 			function fn(){
// 				alert(1);
// 			}
		</script>
	</body>
</html>
